<div>

  <h1>{{ $t('app.name') }}</h1>

  <p>渲染 /api/role/list 列表</p>
  <ul>
    <li v-for="(item, index) in shoppingList" :key="index">{{ item.name }}</li>
  </ul>

  <p>渲染 /api/user/list/page/10/1 列表</p>
  <ul>
    <li v-for="(item, index) in userList" :key="index">{{ item.name }}</li>
  </ul>

  <div class="loading-demo" v-show="loading"> <span></span> <span></span> <span></span> <span></span> <span></span> <span></span> <span></span> <span></span> </div>

  <p>模拟服务端校验密码大于六位数</p>
  <button @click="save">保存</button>
  <input type="test" v-model="userForm.name" placeholder="输入用户名">
  <input type="test" v-model="userForm.password" placeholder="输入密码">
  <div v-show="successMsg">调用成功：{{ successMsg }}</div>
  <div style="color: red;" v-show="errorMsg">调用失败：{{ errorMsg }}</div>

</div>